# Vue 3

In this document, you will learn how to build a Vue 3 application using Rsbuild.

## Create Vue 3 Project

You can use `create-rsbuild` to create a project with Rsbuild + Vue 3. Just execute the following command:

import { PackageManagerTabs } from '@theme';

<PackageManagerTabs
  command={{
    npm: 'npm create rsbuild@latest',
    yarn: 'yarn create rsbuild',
    pnpm: 'pnpm create rsbuild@latest',
    bun: 'bun create rsbuild@latest',
  }}
/>

Then select `Vue 3` when prompted to "Select framework".

## Use Vue in an existing project

To compile Vue SFC (Single File Components), you need to register the Rsbuild [Vue plugin](/plugins/list/plugin-vue). The plugin will automatically add the necessary configuration for Vue builds.

For example, register in `rsbuild.config.ts`:

```ts title="rsbuild.config.ts"
import { defineConfig } from '@rsbuild/core';
import { pluginVue } from '@rsbuild/plugin-vue';

export default defineConfig({
  plugins: [pluginVue()],
});
```

:::tip
For projects using Vue CLI, you can refer to the [Vue CLI Migration Guide](/guide/migration/vue-cli).
:::

## Use the JSX syntax of Vue

If you need to use the JSX syntax of Vue, you also need to register the [Vue 3 JSX plugin](/plugins/list/plugin-vue-jsx).

## TypeScript Support

Rsbuild supports compiling TypeScript by default.

Please refer to the [TypeScript - IDE Support](https://vuejs.org/guide/typescript/overview.html#ide-support) section of the Vue documentation to learn how to set up Vue TypeScript support in your IDE.
